<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>图书管理系统</title>
    <link href="css/register.css" type="text/css" rel="stylesheet"/>
    <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
    <script type="text/javascript">
        <%--attr设置属性值或获取属性值--%>
        function reloadImage(){
            $("#image").attr("src","image.jsp?t="+(new Date).getTime());
        }

        $(document).ready(function (){
            $("#checkcodeId").blur(function (){
                <%-- val() 方法返回或设置被选元素的值。元素的值是通过 value 属性设置的。该方法大多用于 input 元素。--%>
                var $checkcode=$("#checkcodeId").val();
                //校验：文本框的值发送到服务器
                $.post(
                    "CheckCodeServlet",
                    "checkcode="+$checkcode,
                    function (result){ //result存放图片判断地址
                        var $resultHtml=$("<img src='"+result+"' height='25px' width='30px'/>");
                        $("#tip").html($resultHtml);
                        if(result=="icon/wrong.jpg"){
                            //禁用按钮
                            $("#bu").attr("disabled","disabled");
                        }else{
                            $("#bu").removeAttr("disabled");
                        }
                    }
                );
            });
        });
    </script>
</head>
<body>
<body>
<%!
    Object pwdFalse=null;
    Object userHasExist=null;
%>
<%
    pwdFalse=request.getAttribute("pwdFalse");
    userHasExist=request.getAttribute("userHasExist");
    request.removeAttribute("pwdFalse");
    request.removeAttribute("userHasExist");
%>
<div class="wrap">
    <!-- 头部导航-->
    <div class="head">
        <div class="logo-left">
            <a href="#"><img src="icon/logo1.jpg" /></a>
        </div>
        <div id="word">
            <a href="#"><h1 class="logo-right">欢迎注册</h1></a>
        </div>

    </div>

    <!--中间内容 -->
    <div class="content">
        <div class="article">
            <div class="box">
                <form action="RegisterServlet" method="post">
                    <div class="register">
                        <h2>用户注册<a href="login.jsp">立即登录</a></h2>
                    </div>
                    <div class="item">
                        <input type="text" name="name" required="required" placeholder="姓名"/>
                    </div>
                    <div class="item">
                        <input type="text" name="id" required="required" placeholder="<%=userHasExist==null?"账号":"账号重复"%>"/>
                    </div>
                    <div class="item">
                        <input type="text" name="birth" required="required" placeholder="出生年月(YYYY-MM)"/>
                    </div>
                    <div class="item">
                        <input type="text" name="sex" required="required" placeholder="性别(boy/girl)"/>
                    </div>
                    <div class="item">
                        <input type="text" name="address" required="required" placeholder="地址"/>
                    </div>
                    <div class="item">
                        <input type="password" name="pwd" required="required" placeholder="<%=pwdFalse==null?"密码":"密码不一致"%>"/>
                    </div>
                    <div class="item">
                        <input type="password" name="repwd" required="required" placeholder="确认密码"/>
                    </div>
                    <div class="checkcode">
                        <input type="text" name="checkcode" id="checkcodeId" size="4"/>
                        <!--点击超链接不跳转 执行函数 -->
                        <a href="javascript:reloadImage();"><img id="image" src="image.jsp"/></a>
                        <span id="tip"></span>
                    </div>
                    <div class="button">
                        <input id="bu" type="submit" disabled="disabled" value="立即注册"/>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!--尾部内容-->
    <div class="footer">
        <div class="foot">
            Copyright &copy; 2022-2032 SSPU-lyx.com 版权所有
        </div>
    </div>

</div>
</body>
</body>
</html>
